import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(<App></App>, document.getElementById('root'));

for (var i = 0; i < 3; i++) {
  setTimeout(() => {
    console.log('i  ----->  ', i); // 数据结果为3个3
  }, i);
}
// 原因1：var存在变量提升
var i;

// 原因2： 同步代码先于setTimeout执行， i =3
i = 0;
i = 1;
i = 2;
i = 3;
setTimeout(() => {
  console.log('i  ----->  ', i);
}, 0);

setTimeout(() => {
  console.log('i  ----->  ', i);
}, 1);
setTimeout(() => {
  console.log('i  ----->  ', i);
}, 1);

// 解决办法： 使用let
// 1. 不存在💥变量提升
// 2. 作用域内，会形成暂时性死区
for (let i = 0; i < 3; i++) {
  setTimeout(() => {
    console.log('i  ----->  ', i); // 数据结果为：0 1 2
  }, i);
}
